Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Breaking Change][lexical-list] Fix: Preserve original format after indenting list item #6912

Merged
merged 31 commits into from
Dec 10, 2024

Conversation

citruscai
Copy link
Contributor

@citruscai citruscai commented Dec 5, 2024

Description

This PR fixes the issue of format from previous list item being lost when you indent the new list item.

Changes

  • Make ListItemNode inherit from ParagraphNode to have properties for text format
  • Set text format for new list item by getting the format from the selection

Upgrade Notes

The base class for ListItemNode has changed from ElementNode to ParagraphNode which may cause issues in limited situations if you have subclassed ListItemNode:

  • namespace collisions - if you subclass ListItemNode and add properties or methods that were already on ParagraphNode
  • serialization issues - if you have namespace collisions with ParagraphNode in your exportJSON

There may also be issues with type narrowing if you have code that checks $isParagraphNode(node) and expects this to be disjoint from $isListItemNode(node), e.g. this is now wrong:

// WRONG, all ListItemNode are ParagraphNode, so the latter condition never succeeds
if ($isParagraphNode(node)) {
  // do something for paragraphs
} else if ($isListItemNode(node)) {
 // do something for list nodes
}

But it can be fixed by re-ordering the conditions:

// CORRECT, all ListItemNode are ParagraphNode so we check the more specific type first!
if ($isListItemNode(node)) {
  // do something for list item nodes
} else if ($isParagraphNode(node)) {
  // do something for paragraph nodes
}
  • , or issues with type narrowing if you are

Closes #6476

Before

listindentbug.mp4

After

listindentfix.mp4

Copy link

vercel bot commented Dec 5, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
lexical ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 10, 2024 1:45pm
lexical-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Dec 10, 2024 1:45pm

@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label Dec 5, 2024
Copy link

github-actions bot commented Dec 5, 2024

size-limit report 📦

Path Size
lexical - cjs 31.11 KB (0%)
lexical - esm 30.98 KB (0%)
@lexical/rich-text - cjs 40.11 KB (0%)
@lexical/rich-text - esm 32.8 KB (0%)
@lexical/plain-text - cjs 38.68 KB (0%)
@lexical/plain-text - esm 30.11 KB (0%)
@lexical/react - cjs 42 KB (0%)
@lexical/react - esm 34.15 KB (0%)

Comment on lines 245 to 250
const listItemNode = $getNearestNodeOfType(node, ListItemNode);
if ($isListItemNode(node)) {
const listItemNode = $getNearestNodeOfType(node, ListItemNode);

if (listItemNode != null) {
listNodes.add($getTopListNode(listItemNode));
if (listItemNode != null) {
listNodes.add($getTopListNode(listItemNode));
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this change is wrong. $isLeafNode(node) and $isListItemNode(node) are never true at the same time, so this block never does anything now. I guess there just isn't test coverage for what it's trying to do. Can you put this block back to the way it was and see if the tests still pass?

@etrepum
Copy link
Collaborator

etrepum commented Dec 9, 2024

I'm currently trying to get a clean test run, please don't do any updates unless you have a reason to change the code manually (clicking the update button will run all of the tests again which is slowing this review down)

@citruscai
Copy link
Contributor Author

I'm currently trying to get a clean test run, please don't do any updates unless you have a reason to change the code manually (clicking the update button will run all of the tests again which is slowing this review down)

no problem, sorry about that!

Copy link
Collaborator

@etrepum etrepum left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well done!

@etrepum etrepum changed the title [lexical-list] Fix: Preserve original format after indenting list item [Breaking Change][lexical-list] Fix: Preserve original format after indenting list item Dec 10, 2024
@etrepum etrepum added this pull request to the merge queue Dec 10, 2024
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to no response for status checks Dec 10, 2024
@etrepum
Copy link
Collaborator

etrepum commented Dec 10, 2024

There's currently an issue with the merge queue settings that I don't have permissions to fix, but it will be merged when that is resolved. Please don't make any updates in the meantime.

@etrepum etrepum added this pull request to the merge queue Dec 10, 2024
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to no response for status checks Dec 10, 2024
@zurfyx zurfyx added this pull request to the merge queue Dec 10, 2024
@zurfyx zurfyx removed this pull request from the merge queue due to a manual request Dec 10, 2024
@zurfyx zurfyx enabled auto-merge December 10, 2024 13:44
@zurfyx zurfyx added this pull request to the merge queue Dec 10, 2024
Merged via the queue into facebook:main with commit 49580d4 Dec 10, 2024
35 of 37 checks passed
@etrepum
Copy link
Collaborator

etrepum commented Dec 12, 2024

This change was reverted in #6944 due to some compatibility issues internally at Meta with the change in class hierarchy. The majority of this change is good, but in order to have better backwards compatibility the most pragmatic approach will be to create a new base class common to ParagraphNode and ListItemNode that has the common functionality so that $isParagraphNode and $isListItemNode can remain disjoint. Since this is a bit involved I'll take a first pass at this sometime this week.

etrepum added a commit to etrepum/lexical that referenced this pull request Dec 16, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. extended-tests Run extended e2e tests on a PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Bug: Selection formatting/styling is lost when you indent a list
4 participants